<template>
    <div>
        <ul>
            <li v-for="(v,i) in arr" :key="i" :taxt="v.data">
                <i :class="v.url"></i>
                {{v.data}}</li>
        </ul>
    </div>
</template>

<script>
import getLink from "@/api/getindex.js"

export default {
    data(){
        return {

            arr:[]
        }
    },
    created(){
    getLink("/mock/data/index").then(res => {
    this.arr =res.data;
    })
}
}
</script>

<style scoped>
@import url(//at.alicdn.com/t/font_2876113_77batkt47ot.css);
i{
    font-size: 0.5rem;
}
li{
    width: 20%;
    text-align: center;
    font-size: 0.25rem;
    display: flex;
    flex-direction: column;
    margin-top: 2%;
    flex-wrap: wrap;
    flex:auto;
}
ul{

    list-style: none;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-content: space-evenly;
    margin-top: 3%;
}
</style>
